<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core">

    <h:body>

        <ui:composition template="/resources/template/template.xhtml">

            <ui:define name="content">
                <h:form>
                    <p:panel header="Manage Relationships"  >
                        <table >
                            <tr>
                                <td>
                                    <p:panel id="panelSelect" >
                                        <table class="alignTop">
                                            <tr  class="alignTop">
                                                <td colspan="2"  class="alignTop">
                                                    <p:selectOneListbox id="lstItems" value="#{relationshipController.current}" >
                                                        <f:selectItems value="#{relationshipController.items}" var="r" itemLabel="#{r.atobName} - #{r.btoaName} " itemValue="#{r}" ></f:selectItems>
                                                        <f:ajax event="change" execute="lstItems" render="panelDetails" ></f:ajax>
                                                    </p:selectOneListbox>
                                                </td>
                                            </tr>
                                            <tr  class="alignTop">
                                                <td  class="alignTop">
                                                    <p:commandButton id="btnAdd" value="Add New" action="#{relationshipController.prepareAdd()}"
                                                                     process="btnAdd" update="lstItems panelDetails" ></p:commandButton>
                                                </td>
                                                <td  class="alignTop">
                                                    <p:commandButton id="btnDelete" value="Delete" action="#{relationshipController.prepareAdd()}"
                                                                     process="btnDelete" 
                                                                     update="lstItems panelDetails" ></p:commandButton>

                                                </td>
                                            </tr>
                                        </table>



                                    </p:panel>


                                </td>
                                <td>

                                    <p:panel id="panelDetails" >
                                        <table >
                                            <tr>
                                                <td colspan="2">
                                                    <p:panelGrid columns="2">
                                                        <p:outputLabel value="A to B Name:" for="atobName" />
                                                        <p:inputText id="atobName" value="#{relationshipController.current.atobName}" title="A to B Name" />
                                                        <p:outputLabel value="B to A Name:" for="btoaName" />
                                                        <p:inputText id="btoaName" value="#{relationshipController.current.btoaName}" title="B to A Name" />
                                                        <p:outputLabel value="Order No:" for="orderNo" />
                                                        <p:inputText id="orderNo" value="#{relationshipController.current.orderNo}" title="Order No" />
                                                    </p:panelGrid>
                                                </td>
                                            </tr>
                                            <tr>
                                                <td>
                                                    <p:spacer ></p:spacer>    
                                                </td>
                                                <td>
                                                    <p:commandButton id="btnSave" 
                                                                     value="Save"
                                                                    action="#{relationshipController.saveSelected()}"
                                                                     process="btnSave panelDetails" update="lstItems" ></p:commandButton>
                                                </td>

                                            </tr>
                                        </table>

                                    </p:panel>
                                </td>
                            </tr>                            
                        </table>

                    </p:panel>
                </h:form>
            </ui:define>


        </ui:composition>

    </h:body>
</html>
